﻿@model GUI.Models.ArticleModel

@{
    ViewBag.Title = "EditArticle";
}

<link href="~/Content/jquery-ui/jquery-uidatepicker.css" rel="stylesheet" />

<script src="@Url.Content("~/Scripts/jquery-1.8.2.js")"></script>
<script src="~/Scripts/jquery-ui-1.8.20.min.js"></script>

<style>


  .tblarticle, td, th {
   
     padding: 15px;
     background-color:#F8F8F8;
     
}

   input[type="file"] {
  background-color:white; 
  font:bold 14px Arial, Helvetica, sans-serif; 
  color:#3287C8; 
  border:thick; 
  cursor:pointer; 
}


</style>





@using (Html.BeginForm("EditArticle", "Articles", FormMethod.Post, new { @enctype = "multipart/form-data", id = "profilepicture" }))
{
    @Html.ValidationSummary(true)

   <table class="tblarticle">
    <caption> <div class="">
           
        </div></caption>
  <tr>
      <td>  @Html.HiddenFor(model => model.Id)</td>
  </tr>
       
        <tr>
        

       <td> @Html.ListBox("ThemeList",  ViewBag.Themesl as MultiSelectList,
           new { @class = "chzn-select", data_placeholder = "Choose Themes...", style = "width:350px;" })</td>

@*<td>
<select class = "chzn-select" name="ThemeList"   multiple style="width:250px;height:100px" >
 @foreach (var item in @ViewBag.ThemeList as MultiSelectList)
 {
     
    <option selected="@item.Selected">

  </option>
 }
</select>
    </td>*@
       </tr>
        
    
        
    <tr>
        
 <td class="txttile"colspan="3">   @Html.TextAreaFor(model => model.Title, new { style = "width: 800px;" })</td>
    </tr>
    <tr>
        <td colspan="3">   @Html.EditorFor(model => model.ArticleContenent)</td>
    </tr>
    
    <tr>
    <td>@Html.HiddenFor(model => model.AuteurId) </td>
            
    </tr>
     






    <tr>

      


    
      @if (@Model.ImageBytes != null)   
      {
      <td><img src="data:image;base64,@System.Convert.ToBase64String(@Model.ImageBytes)" style="width:100px; height:75px" />
        </td>
        

      }else{
          <td>
              <img src="~/Images/noneimage.png" style="width:100px; height:75px" />
          </td>
       

             }
     
      <td> <input type="file" name="fileBigSize" id="myfile" />   </td>
 
</tr>
    
       
    
     <tr>

           
      @if (@Model.ImageMedium != null)
      {
      <td><img src="data:image;base64,@System.Convert.ToBase64String(@Model.ImageMedium)" style="width:100px; height:75px" />
          </td>
           
      }
      else
      {
          <td><img src="~/Images/noneimage.png" style="width:100px; height:75px" />
          </td>
        
      }
           <td> <input type="file" name="fileMediumsize"  id="myfile1" />   </td>
    

       </tr>


    <tr>

             @if (@Model.ImageLittle != null)
             {
      <td><img src="data:image;base64,@System.Convert.ToBase64String(@Model.ImageLittle)" style="width:100px; height:75px" />
          </td>
             }else{
                 
                  <td><img src="~/Images/noneimage.png" style="width:100px; height:75px" />
                      </td>
             }

           <td> <input type="file" name="fileLittlesize"  id="myfile2" />   </td>

       </tr>
       
       
       
       
       <tr>
        <td>  <input type="submit" id="valiarticle" value="Submit" /></td>
    </tr>


       <tr>
           <td>
               <input type="hidden" value="@Model.ImageBytes" />
           </td>
           <td><input type="hidden" value="@Model.ImageMedium" /> </td>
       </tr>
       <tr>
           <td> <input type="hidden" value="@Model.ImageLittle" /></td>
       </tr>

</table>
}
  
<div>
    @Html.ActionLink("Back to List", "Index", new  { id=@ViewBag.authorid})
</div>

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}
<script>
    $(function () { 
        $(LabelDateCreation).datepicker();
    });
  </script>







<script src="@Url.Content("~/Content/chosen/chosen.jquery.js")" type="text/javascript"></script>
<link href="@Url.Content("~/Content/Chosen/chosen.min.css")" rel="stylesheet"  type="text/css" />
<script> $(".chzn-select").chosen(); </script>
<script type="text/javascript">
    $(document).ready(function(){
        debugger;

     
@*        var img =@Html.Raw(Json.Encode(@ViewBag.imagebyte));
       
        if(img !=null)*@
        
            $("#myfile").val("");
        
  
    });

  
</script>



<script type="text/javascript">
    function AddArticles() {

        var auteur =
        {
            "Title": $(Title).val(),
            "ArticleContenent": $(ArticleContenent).val(),
            "Profil": $(Profil).val(),
            "Adressmail": $(Adressmail).val()
        };


        $.ajax({
            url: '/Auteur/AddUser/',
            data: JSON.stringify(auteur),
            type: 'POST',
            contentType: 'application/json; charset=utf-8',
            success: function (data) {
                var output;
                output += '<ul>' + '<li>' + data.Status + '</li>' + '</ul>';
                $("#msg").html(output);


            }
        });

    }
    </script>